<template>
	<view>
		<view class="content" v-html="content">
		</view>
		<button class="btn" type="primary" @click="enter">进入公众号</button>
<!-- 		<view class="coupon-list-wrapper" v-if="'coupon_title' in coupon_info">
			<view class="coupon-wrapper type1" v-if="coupon_info.coupon_type_id == 1">
				<view class="top">
					<view class="name-and-info">
						<text class="name">{{coupon_info.coupon_title}}</text>
						<text class="info">仅限本人使用，不得转送他人</text>
					</view>
					<text class="type">免费尝鲜</text>
				</view>
				<view class="bottom">
					<text class="date">菜品名称：{{coupon_info.name}}</text>
					<text class="btn" @click="takeCoupon">立即领取</text>
				</view>
			</view>
			<view class="coupon-wrapper type2" v-else-if="coupon_info.coupon_type_id == 3">
				<view class="top">
					<view class="name-and-info">
						<text class="name">{{coupon_info.coupon_title}}</text>
						<text class="info">仅限本人使用，不得转送他人</text>
					</view>
					<text class="type">周体验</text>
				</view>
				<view class="bottom">
					<text class="date">计划名称：{{coupon_info.name}}</text>
					<text class="btn" @click="takeCoupon">立即领取</text>
				</view>
			</view>
			<view class="coupon-wrapper type3" v-else-if="coupon_info.coupon_type_id == 2">
				<view class="top">
					<text class="name">满<text>{{coupon_info.full_money}}</text>元减<text>{{coupon_info.jian_money}}</text>元</text>
					<text class="info">仅限本人使用，不得转送他人</text>
				</view>
				<view class="bottom">
					<text class="date">{{coupon_info.coupon_title}}</text>
					<text class="btn" @click="takeCoupon">立即领取</text>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				content: '',
				coupon_info: {},
				user_id: 0,
				order_id: 0,
			};
		},
		onLoad(o) {
			this.user_id = o.user_id
		},
		mounted() {
			this.getData();
		},
		methods: {
			getData: function() {
				this.$api.getCustomerService({
						id: 2
					})
					.then(res => {
						this.content = res.data
					})
				this.$api.getNew()
					.then(res => {
						console.log(res);
						if (!res.data) {
							return false;
						}
						this.coupon_info = res.data;
						this.takeCoupon();
					})
			},
			takeCoupon: function() {
				this.$api.newUserCoupons({
						user_id: this.user_id,
					})
					.then(res => {
						// this.$db._ShowToast(res.msg, () => {
						// 	this.$db._NavTo('index', this.$db.navToMethod[1])
						// })
					})
			},
			enter: function(){
				this.$db._NavTo('index', this.$db.navToMethod[2])
			}
		}
	}
</script>

<style lang="scss">
	page{
		overflow: hidden;
		padding: 0 20rpx;
		padding-bottom: 40rpx;
	}
	.content {
		& /deep/ img {
			max-width: 100%;
		}
	}
	
	.btn{
		margin: 80rpx 40rpx;
		background: #DFBB50;
		&.button-hover{
			background: #bf9d3f;
		}
	}

	// .coupon-list-wrapper {
	// 	padding-top: 70rpx;

	// 	.coupon-wrapper {

	// 		&.type1 {
	// 			margin: 0 auto;
	// 			padding: 0 32rpx;
	// 			width: 714rpx;
	// 			height: 219rpx;
	// 			display: flex;
	// 			flex-flow: column;
	// 			background: url(../../static/coupon/lv@3x@2x.png);
	// 			background-repeat: no-repeat;
	// 			background-position: center;
	// 			background-size: 100%;
	// 			box-sizing: border-box;
	// 			border: 1rpx solid rgba(0, 0, 0, 0);

	// 			.top {
	// 				margin-top: 32rpx;
	// 				display: flex;
	// 				align-items: center;

	// 				.name-and-info {
	// 					display: flex;
	// 					flex-flow: column;

	// 					.name {
	// 						margin-bottom: 8rpx;
	// 						font-size: 32rpx;
	// 						color: rgba(72, 133, 56, 1);
	// 					}

	// 					.info {
	// 						font-size: 22rpx;
	// 						color: #488538;
	// 					}
	// 				}

	// 				.type {
	// 					margin-left: auto;
	// 					font-size: 38rpx;
	// 					font-weight: normal;
	// 					color: #FFFFFF;
	// 				}
	// 			}

	// 			.bottom {
	// 				margin-top: auto;
	// 				margin-bottom: 22rpx;
	// 				display: flex;
	// 				align-items: center;
	// 				justify-content: space-between;

	// 				.date {
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					color: rgba(149, 149, 149, 1);
	// 				}

	// 				.btn {
	// 					margin-right: 5rpx;
	// 					padding: 4rpx 20rpx;
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					border: 2px solid rgba(105, 156, 7, 1);
	// 					border-radius: 26rpx;
	// 					color: #699C07;
	// 				}
	// 			}
	// 		}

	// 		&.type2 {
	// 			margin: 0 auto;
	// 			padding: 0 32rpx;
	// 			width: 714rpx;
	// 			height: 219rpx;
	// 			display: flex;
	// 			flex-flow: column;
	// 			background: url(../../static/coupon/cs@3x@2x.png);
	// 			background-repeat: no-repeat;
	// 			background-position: center;
	// 			background-size: 100%;
	// 			box-sizing: border-box;
	// 			border: 1rpx solid rgba(0, 0, 0, 0);

	// 			.top {
	// 				margin-top: 32rpx;
	// 				display: flex;
	// 				align-items: center;

	// 				.name-and-info {
	// 					display: flex;
	// 					flex-flow: column;

	// 					.name {
	// 						margin-bottom: 8rpx;
	// 						font-size: 32rpx;
	// 						color: #D49A00;
	// 					}

	// 					.info {
	// 						font-size: 22rpx;
	// 						color: #D49A00;
	// 					}
	// 				}

	// 				.type {
	// 					margin-left: auto;
	// 					font-size: 38rpx;
	// 					font-weight: normal;
	// 					color: #FFFFFF;
	// 				}
	// 			}

	// 			.bottom {
	// 				margin-top: auto;
	// 				margin-bottom: 22rpx;
	// 				display: flex;
	// 				align-items: center;
	// 				justify-content: space-between;

	// 				.date {
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					color: rgba(149, 149, 149, 1);
	// 				}

	// 				.btn {
	// 					margin-right: 5rpx;
	// 					padding: 4rpx 20rpx;
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					border: 2px solid #F2C866;
	// 					border-radius: 26rpx;
	// 					color: #F2C866;
	// 				}
	// 			}
	// 		}

	// 		&.type3 {
	// 			margin: 0 auto;
	// 			padding: 0 32rpx;
	// 			width: 714rpx;
	// 			height: 219rpx;
	// 			display: flex;
	// 			flex-flow: column;
	// 			background: url(../../static/coupon/lan@3x@2x.png);
	// 			background-repeat: no-repeat;
	// 			background-position: center;
	// 			background-size: 100%;
	// 			box-sizing: border-box;
	// 			border: 1rpx solid rgba(0, 0, 0, 0);

	// 			.top {
	// 				margin: 0 auto;
	// 				margin-top: 14rpx;
	// 				display: flex;
	// 				flex-flow: column;
	// 				align-items: center;

	// 				.name {
	// 					font-size: 32rpx;
	// 					color: #F8F8F8;

	// 					text {
	// 						font-size: 54rpx;
	// 					}
	// 				}

	// 				.info {
	// 					font-size: 22rpx;
	// 					color: #F8F8F8;
	// 				}
	// 			}

	// 			.bottom {
	// 				margin-top: auto;
	// 				margin-bottom: 22rpx;
	// 				display: flex;
	// 				align-items: center;
	// 				justify-content: space-between;

	// 				.date {
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					color: rgba(149, 149, 149, 1);
	// 				}

	// 				.btn {
	// 					margin-right: 5rpx;
	// 					padding: 4rpx 20rpx;
	// 					font-size: 26rpx;
	// 					font-weight: normal;
	// 					border: 2px solid #F2C866;
	// 					border-radius: 26rpx;
	// 					color: #F2C866;
	// 				}
	// 			}
	// 		}

	// 		&+.coupon-wrapper {
	// 			margin-top: 61rpx;
	// 		}


	// 		&.invalid {
	// 			background: url(../../static/coupon/hui@3x@2x.png);
	// 			background-repeat: no-repeat;
	// 			background-position: center;
	// 			background-size: 100%;

	// 			text {
	// 				color: #F8F8F8;
	// 			}

	// 			.name,
	// 			.info,
	// 			.btn {
	// 				color: #939393 !important;

	// 				text {
	// 					color: #939393 !important;
	// 				}
	// 			}

	// 			.btn {
	// 				border: 2rpx solid #939393 !important;
	// 			}
	// 		}
	// 	}
	// }
</style>
